﻿<script src="/Scripts/pages/PageSliding.js" type="text/javascript"></script>


<div id="demoSlidingPage">
    <div class="sliding-pages">
        <div class="sliding-pages-wrap clearfix">
            <div class="sliding-page" style="background-color: lightblue;">
                <h1>Page 1</h1>
                <p>here is some text, some text here</p>
                <p>here is some text, some text here</p>
                <p>here is some text, some text here</p>
                <p>here is some text, some text here</p>
            </div>
            <div class="sliding-page" style="background-color: yellow;">
                <h1>Page 2</h1>
                <p>a very long paragraph text here, you can try the vertical scroll</p>
                <p>a very long paragraph text here, you can try the vertical scroll</p>
                <p>a very long paragraph text here, you can try the vertical scroll</p>
                <p>a very long paragraph text here, you can try the vertical scroll</p>
                <p>a very long paragraph text here, you can try the vertical scroll</p>
                <p>a very long paragraph text here, you can try the vertical scroll</p>
                <p>a very long paragraph text here, you can try the vertical scroll</p>
                <p>a very long paragraph text here, you can try the vertical scroll</p>
                <p>a very long paragraph text here, you can try the vertical scroll</p>
                <p>a very long paragraph text here, you can try the vertical scroll</p>
                <p>a very long paragraph text here, you can try the vertical scroll</p>
                <p>a very long paragraph text here, you can try the vertical scroll</p>
                <p>a very long paragraph text here, you can try the vertical scroll</p>
            </div>
            <div class="sliding-page" style="background-color: silver;">
                <h1>Page 3</h1>
                <p>here is some text, some text here</p>
                <p>here is some text, some text here</p>
                <p>here is some text, some text here</p>
                <p>here is some text, some text here</p>
            </div>
            <div class="sliding-page" style="background-color: lightpink;">
                <h1>Page 4</h1>
                <p>here is some text, some text here</p>
                <p>here is some text, some text here</p>
                <p>here is some text, some text here</p>
                <p>here is some text, some text here</p>
            </div>
        </div>
    </div>
    <div id="footer">
        <ul class="nav4">
            <li>
                <div>Blue</div>
            </li>
            <li>
                <div>Yellow</div>
            </li>
            <li>
                <div>Silver</div>
            </li>
            <li>
                <div>Pink</div>
            </li>
        </ul>
    </div>
</div>